<!--
    选择时间
-->
<template>
  <div>
    <van-field
      :label="label"
      required
      readonly
      clickable
      :value="value"
      right-icon="arrow"
      placeholder="请选择接日期"
      @click.stop="showDatetimePicker"
    />
    <van-action-sheet v-model="isShowDatetimePicker">
      <van-datetime-picker
        title="请选择日期"
        :type="datetimePickerType"
        :min-date="minDate"
        :max-date="maxDate"
        @cancel="cancel"
        @confirm="confirm"
      />
    </van-action-sheet>
  </div>
</template>
<script>
import { DatetimePicker } from "vant";
export default {
  components: {
    [DatetimePicker.name]: DatetimePicker
  },
  data() {
    return {
      isShowDatetimePicker: false,
      value: ""
    };
  },
  props: {
    label: {
      default: "截止时间",
      type: String
    },
    datetimePickerType: {
      default: "date",
      type: String
    },
    minDate:{
        default:new Date(),
    },
    maxDate:{
        default:new Date(2999, 9, 1)
    }
  },
  methods: {
    showDatetimePicker() {
      this.isShowDatetimePicker = true;
    },
    confirm(value) {
      this.value = value.getTime();
      //this.$emit("change", this.value, value);
      this.cancel();
    },
    // 隐藏弹框
    cancel() {
      this.isShowDatetimePicker = false;
    }
  }
};
</script>
<style lang="less" scoped>
</style>